import React from 'react';
import { Row, Col, Form, Table, message, Popconfirm, Modal, InputNumber, Input, Button} from 'antd';
const R = require('ramda');
import BizParams from '../../../components/commons/BizParams';
import CurrencySelect from '../../../components/commons/CurrencySelect'

const FormItem = Form.Item;
export default Form.create({ wrappedComponentRef: true })(class CostDetail extends React.Component {
    constructor(props) {
        super(props);
        this.state = {
            open: false,
            type: "1", //1.查看费用 2.新增费用 3.申报费用
            dataSource: {},
            order: {},
            searchConditions: {},
        }
    }

    handleClose = () => {
        this.setState({ open: false });
        this.props.form.resetFields();
    }

    handleSaveCost = () => {
        this.props.form.validateFields((errors, values) => {
            if (errors) {
                return;
            }
            values.orderid = this.state.searchConditions.id;
            values.baseCost = (values.cost - values.benefit).toFixed(2);
            this.props.dispatch({
                type: 'orderCost/addOrderCost',
                payload: {
                    id: this.state.searchConditions.id,
                    data: values,
                    searchConditions: this.state.searchConditions
                },

            })
            this.handleClose();
        })
    }

    handleApplyCost = () => {
        this.props.form.validateFields((errors, values) => {
            if (errors) {
                return;
            }
            values.orderid = this.state.searchConditions.id;
            values.baseCost = (values.cost - values.benefit).toFixed(2);
            values.id = this.state.dataSource.id;
            this.props.dispatch({
                type: 'orderCost/applyOrderCost',
                payload: {
                    data: values,
                    searchConditions: this.state.searchConditions
                },

            })
            this.handleClose();
        })
    }

    handleOpen = (dataSource, type, order, searchConditions) => {
        this.setState({ dataSource: dataSource, open: true, type: type, order: order, searchConditions: searchConditions});
    }

    render() {
        let titles = {"1": "查看费用", "2": "添加费用", "3": "申报费用"};
        let formItemLayout = { labelCol: { span: 6 }, wrapperCol: { span: 18 } };
        let dataSource = R.isNil(this.props.dataSource) ? {} : this.props.dataSource;
        let { getFieldDecorator } = this.props.form;

        let footer = [
            <Button key="save" size="large" onClick={this.handleSaveCost.bind(this)} style={{display: this.state.type === "2" ? "inline-block" : "none"}}>保存</Button>,
            <Button key="apply" size="large" onClick={this.handleApplyCost.bind(this)} style={{display: this.state.type === "3" ? "inline-block" : "none"}}>确认</Button>,
            <Button key="cancel" size="large" onClick={this.handleClose.bind(this)} style={{display: this.state.type !== "1" ? "inline-block" : "none"}}>取消</Button>
        ]

        return (
            <Modal maskClosable={false} footer={footer} visible={this.state.open} title={titles[this.state.type]} width={600} wrapClassName="vertical-center-modal" onCancel={this.handleClose.bind(this)}>
                <Form>
                    <Row>
                        <Col span={12}>
                            <FormItem {...formItemLayout} label="订单编号" hasFeedback>
                                {R.isNil(this.state.order.orderno) ? "" : this.state.order.orderno}
                            </FormItem>
                        </Col>
                    </Row>
                    <Row>
                        <Col span={12}>
                            <FormItem {...formItemLayout} label="费用种类" hasFeedback>
                                {getFieldDecorator('chargetype', {
                                    rules: [{
                                        required: true, message: '请选择费用种类'
                                    }],
                                    initialValue: this.state.dataSource.chargetype
                                })(
                                    <BizParams sprCode='chargeType' disabled={this.state.type !== "2"} />
                                    )}
                            </FormItem>
                        </Col>
                        <Col span={12}>
                            <FormItem {...formItemLayout} label="币种" hasFeedback>
                                {getFieldDecorator('chargecurrency', {
                                    rules: [{
                                        required: true, message: '请选择币种'
                                    }],
                                    initialValue: "CNY"
                                })(
                                    <CurrencySelect disabled={true} />
                                    )}
                            </FormItem>
                        </Col>
                    </Row>
                    <Row>
                        <Col span={12}>
                            <FormItem {...formItemLayout} label="费用金额" hasFeedback>
                                {getFieldDecorator('cost', {
                                    rules: [{
                                        required: true, message: '请输入费用金额'
                                    }],
                                    initialValue: this.state.dataSource.cost
                                })(
                                    <InputNumber disabled={this.state.type === "1"} style={{width: '100%'}} max={99999999999999} precision={2} />
                                )}
                            </FormItem>
                        </Col>
                        <Col span={12}>
                            <FormItem {...formItemLayout} label="利润" hasFeedback>
                                {getFieldDecorator('benefit', {
                                    rules: [{
                                        required: true, message: '请输入利润'
                                    }],
                                    initialValue: this.state.dataSource.benefit
                                })(
                                    <InputNumber disabled={this.state.type === "1"} style={{width: '100%'}} max={99999999999999} precision={2} />
                                )}
                            </FormItem>
                        </Col>
                    </Row>
                    <Row>
                        {/*<Col span={12}>*/}
                        {/*    <FormItem {...formItemLayout} label="金额" hasFeedback>*/}
                        {/*        {getFieldDecorator('cost', {*/}
                        {/*            rules: [{*/}
                        {/*                required: true, message: '请输入金额'*/}
                        {/*            }],*/}
                        {/*            initialValue: this.state.dataSource.cost*/}
                        {/*        })(*/}
                        {/*            <InputNumber disabled={this.state.type === "1"} style={{width: '100%'}} max={99999999999999} precision={2} />*/}
                        {/*            )}*/}
                        {/*    </FormItem>*/}
                        {/*</Col>*/}
                        <Col span={12}>
                            <FormItem {...formItemLayout} label="备注" hasFeedback>
                                {getFieldDecorator('memo', {
                                    initialValue: this.state.dataSource.memo
                                })(
                                    <Input.TextArea disabled={this.state.type === "1"} maxLength="100" autosize={true}/>
                                    )}
                            </FormItem>
                        </Col>
                    </Row>
                </Form>
            </Modal>
        )
    }
})